import React, {
    useState,
    useEffect,
    useMemo,
    useCallback,
    useLayoutEffect
} from "react";
import { connect, useDispatch } from "react-redux";
import $ from "jquery";
import { registerMicroApps, start, loadMicroApp } from 'qiankun';
import "./index.scss";

function Header(props){
    let {
        userInfo,
        sysAddrInfo,
        sysInfo,
        currentIdentity,
        data
    } = props;

    const dispatch = useDispatch();

    useEffect(() => {
        // let url = data.url.replace("[token]", sessionStorage.getItem("token")).replace("[identityCode]", currentIdentity.identityCode);
        // let params = {};
        // data.params.forEach((item)=>{
        //     params[item] = item.replace("baseUrl", sysInfo.baseUrl);
        // })
        // console.log((data.sysId === "000"? sysInfo.baseUrl: sysAddrInfo[data.sysId]?.webSvrAddr) + url, params, data.key, $(`#${data.key.replace("-", "")}`))
        // window._loadApp = loadMicroApp({
        //     name: 'app',
        //     entry: (data.sysId === "000"? sysInfo.baseUrl: sysAddrInfo[data.sysId]?.webSvrAddr) + url,
        //     container: `#${data.key.replace("-", "")}`,
        //     sandbox: {strictStyleIsolation: true, experimentalStyleIsolation: true},//没啥用
        //     props: params
        // });
        // return () => {
        //     window._loadApp.unmount();
        // }
    }, [sysAddrInfo, sysInfo, currentIdentity, data]);
    return (
        <div className="qiankun-page" id={data.key.replace("-", "")}></div>
    )
}

const mapProps = (state) => {
    return {
        userInfo: state.userInfo,
        sysInfo: state.sysInfo,
        sysAddrInfo: state.sysAddrInfo,
        currentIdentity: state.currentIdentity,
    }
}
export default connect(mapProps)(Header);